<!DOCTYPE html>
<html lang="en" ng-app>

<head>
    <meta charset="UTF-8">
    <title>组卷</title>
    <link href="./css/bootstrap.css" rel="stylesheet">
    <link href="./css/font-awesome.css" rel="stylesheet">
    <link href="./css/main.css" rel="stylesheet">
    <link href="./css/bootstrap-datetimepicker.css" rel="stylesheet" media="screen">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/jquery.pin.js"></script>
    <script type="text/javascript" src="./js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
    <script type="text/javascript" src="./js/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script>
    <script src="js/angular.min.js"></script>

</head>

<body ng-controller="editexam">
    <!--导航栏-->
    <div class="navbar navbar-njust navbar-fixed" role="navigation">
        <div class="container clearfix">
            <div class="navbar-header">

                <div class="navbar-brand">
                    <i class="fa fa-cubes"></i>
                    <h4 id="maintitle">课程考试系统</h4>
                </div>
            </div>

            <div class="navbar-collapse collapse">

                <ul class="nav navbar-nav" style="margin-left:200px">
                    <li class="pull-left">
                        <a href="home.html">首页</a>
                    </li>
                    <li class="pull-left">
                        <a href="teacher.html#">教师页面</a>
                    </li>
                    <li class="pull-left active">
                        <a href="EditExam.html">新建考试</a>
                    </li>
					<li class="pull-left ">
                        <a href="questionbank.html">增加题目</a>
                    </li>
                </ul>
                <div class="list-unstyled pull-right clearfix dropdown" style="margin-top:25px">
                    <li class="dropdown-toggle " id="dropdownMenu1" data-toggle="dropdown">
                        <a href="" style="width:200px">欢迎您，{{teacher.name}}老师</a> 
                    </li>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="teacherEditInfo.html">我的账户</a>
                        </li>
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">注销</a>
                        </li>
                    </ul>

                </div>
            </div>
        </div>

    </div>

    <div class="container" >
		<!--Exam-->
        <div class="row" >
            <div class="col-md-2"> <!-- courses -->
                <div class="dropdown">
                    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown">
                        选择课程
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item"
							ng-repeat="course in courses" ng-click="chooseCourse(course.courseNo)">
							{{course.courseName}}
						</a></li>
                    </ul>
                </div>

            </div>
            <div class="col-md-2"> <!--exam.name-->
                <input type="text" class="form-control" placeholder="考试名称" ng-model="exam.name" />
            </div>
			
            <div class="col-md-3" style="padding:0px"> <!--start time-->
                <div class="form-group">
                    <label for="inputPassword3" class="col-md-4 control-label">开始时间</label>
                    <div class="input-group date form_datetime col-md-8" data-date="1979-09-16T05:25:07Z" data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">
                        <input class="form-control" type="text" value="" readonly ng-model="exam.startTime"/>
                        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
                    </div>
                    <input type="hidden" id="dtp_input1" value="">
                    <br/>
                </div>
            </div>
            <div class="col-md-3"> <!--time-->
                <div class="form-group">
                    <label for="inputPassword3" class="col-md-4 control-label">考试时长</label>
                    <div class="dropdown col-md-3">
                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown">
                            小时
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item"
								ng-click="">1</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item"
								ng-click="">2</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item"
								ng-click="">3</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item"
								ng-click="">4</a>
                            </li>
                        </ul>
                    </div>

                    <div class="dropdown col-md-3">
                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu4" data-toggle="dropdown">
                            分钟
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item">00</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item">15</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item">30</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#" class="item">45</a>
                            </li>
                        </ul>
                    </div>


                </div>
			</div>
            
			<div class="col-md-2" style="margin-left:"> <!-- newExam -->
                <button type="button" class="btn btn-success" id="confirm" ng-click="newExam()">确认新建</button>
            </div>

        </div>
        
		<hr/>
        
        <!-- Problems -->
        <div class="row" id="paper" style="display:none">
			<!--选择题-->
            <div class="col-md-12">
               <div class="row">
                   <div class="col-md-2">
                       <h3>选择题 </h3>
                   </div>
                   <div class="col-md-4">
                       <h3>选择题分值：{{multipleSum}}</h3>
                   </div>
                   <div class="col-md-1">
                       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#xuanzeModal">增加</button>
                   </div>
                   <div class="col-md-1">
                       <button type="button" class="btn btn-danger" id="chosedele-xuanze">删除</button>
                   </div>
                   <div class="col-md-1" >
                       <button type="button" class="btn btn-danger" style="display:none" id="confirmdele-xuanze"  
							ng-click="deleteExamQuestion('xuanze')" >确认删除</button>
                   </div>
               </div>
               
			   <div ng-repeat="multiple in exam_multiples">
				   <div class="row">
					  <div class="col-md-1">
						 <input type="checkbox" class="check-xuanze" style="display:none" 
							ng-model="multiple.selected"/>        
					  </div>
					  <div class="col-md-8">
							<pre>{{multiple.questionStem}}</pre>  
					  </div>
					  <div class="col-md-1">
						  <div class="row">
							  <div class="col-md-12">知识点</div>
							  <div ng-repeat="knowledge in multiple.knowledge">
								<div class="col-md-12"><span class="label label-info">{{knowledge}}</span></div>
							  </div>
						  </div>
					  </div>
					  <div class="col-md-1">
						 难度：{{multiple.difficulty}}
					  </div>
					  <div class="col-md-1">
						 分值：{{multiple.value}}
					  </div>                   
				   </div>
               </div>
			   
            </div>
            
			<!--填空题-->
            <div class="col-md-12" >
               <div class="row">
                   <div class="col-md-2">
                       <h3>填空题</h3>
                   </div>
                   <div class="col-md-4">
                       <h3>填空题分值： {{shortSum}}</h3>
                   </div>
                   <div class="col-md-1">
                       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#tiankongModal">增加</button>
                   </div>
                   <div class="col-md-1">
                       <button type="button" class="btn btn-danger" id="chosedele-tiankong">删除</button>
                   </div>
                    <div class="col-md-1" >
                       <button type="button" class="btn btn-danger" style="display:none" id="confirmdele-tiankong"
						ng-click="deleteExamQuestion('tiankong')">确认删除</button>
                   </div>
               </div>
			   
			   <div ng-repeat="shortAnswer in exam_shorts">
				   <div class="row" >
					  <div class="col-md-1">
						 <input type="checkbox" class="check-tiankong" style="display:none"
							ng-model="shortAnswer.selected"/>        
					  </div>
					  <div class="col-md-8">
							<pre>{{shortAnswer.questionStem}}</pre>
					  </div>
					  <div class="col-md-1">
						  <div class="row">
							  <div class="col-md-12">知识点</div>
							  <div ng-repeat="knowledge in shortAnswer.knowledge">
								<div class="col-md-12"><span class="label label-info">{{knowledge}}</span></div>
							  </div>
						  </div>
					  </div>
					  <div class="col-md-1">
						 难度：{{shortAnswer.difficulty}}
					  </div>
					  <div class="col-md-1">
						 分值：{{shortAnswer.value}}
					  </div>
				   </div>
			   </div>
               
            </div>
            
			<!--简答题-->
            <div class="col-md-12" >
               <div class="row">
                   <div class="col-md-2">
                       <h3>简答题</h3>
                   </div>
                   <div class="col-md-4">
                       <h3>简答题分值：{{longSum}}</h3>
                   </div>
                   <div class="col-md-1">
                       <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#jiandaModal">增加</button>
                   </div>
                   <div class="col-md-1">
                       <button type="button" class="btn btn-danger" id="chosedele-jianda">删除</button>
                   </div>
                   <div class="col-md-1" >
                       <button type="button" class="btn btn-danger" style="display:none" id="confirmdele-jianda"
						ng-click="deleteExamQuestion('jianda')">确认删除</button>
                   </div>
               </div>
			   <div ng-repeat="longAnswer in exam_longs">
				   <div class="row">
					  <div class="col-md-1">
						 <input type="checkbox" class="check-jianda" style="display:none"
							ng-model="longAnswer.selected"/>        
					  </div>
					  <div class="col-md-8">
							<pre>{{longAnswer.questionStem}}</pre>
					  </div>
					  <div class="col-md-1">
						  <div class="row">
							  <div class="col-md-12">知识点</div>
							  <div ng-repeat="knowledge in longAnswer.knowledge">
								<div class="col-md-12"><span class="label label-info">{{knowledge}}</span></div>
							  </div>
						  </div>
					  </div>
					  <div class="col-md-1">
						 难度：{{longAnswer.difficulty}}
					  </div>
					  <div class="col-md-1">
						 分值：{{longAnswer.value}}
					  </div>                   
				   </div>
               </div>
			   
            </div>
            
        </div>
		
		
    
    </div>
    
	<!-- 选择题Modal -->
	<div class="modal fade" id="xuanzeModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="row">
						<div class="col-md-6">
							<h3>增加选择题</h3>
						</div>
						
						<div class="col-md-6"><h3>Search: <input ng-model="query"></h3></div>
					</div>
                </div>
                <div class="modal-body" style="height:400px;overflow:scroll;">
                    <div class="row" ng-repeat="multiple in multiples | filter:query">
						<div class="col-md-1">
							<input type="checkbox" class="check-xuanze" ng-model="multiple.selected"/>
						</div>
						<div class="col-md-8">
							<pre>{{multiple.questionStem}}</pre> 
						</div>
						<div class="col-md-1">
							<div class="row">
								<div class="col-md-12">知识点</div>
								<div class="col-md-12" ng-repeat="knowledge in multiple.knowledge">
									<span class="label label-info">{{knowledge}}</span>
								</div>
							</div>
						</div>
						<div class="col-md-1">
							难度：{{multiple.difficulty}}
						</div>
						<div class="col-md-1">
							分值：{{multiple.value}}
						</div>
					</div>
				</div>
				<div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" 
						ng-click="addExamQuestion('xuanze')">
						确认添加
					</button>
                </div>
			</div>
        </div>
    </div>
	
	<!-- 填空题Modal -->
	<div class="modal fade" id="tiankongModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="row">
						<div class="col-md-6">
							<h3>增加填空题</h3>
						</div>
						
						<div class="col-md-6"><h3>Search: <input ng-model="query"></h3></div>
					</div>
                </div>
                <div class="modal-body" style="height:400px;overflow:scroll;">
                    <div class="row" ng-repeat="multiple in shortAnswers | filter:query">
						<div class="col-md-1">
							<input type="checkbox" class="check-xuanze" ng-model="multiple.selected"/>
						</div>
						<div class="col-md-8">
							<pre>{{multiple.questionStem}}</pre> 
						</div>
						<div class="col-md-1">
							<div class="row">
								<div class="col-md-12">知识点</div>
								<div class="col-md-12" ng-repeat="knowledge in multiple.knowledge">
									<span class="label label-info">{{knowledge}}</span>
								</div>
							</div>
						</div>
						<div class="col-md-1">
							难度：{{multiple.difficulty}}
						</div>
						<div class="col-md-1">
							分值：{{multiple.value}}
						</div>
					</div>
				</div>
				<div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" 
						ng-click="addExamQuestion('tiankong')">
						确认添加
					</button>
                </div>
			</div>
        </div>
    </div>
	
	<!-- 简答题Modal -->
	<div class="modal fade" id="jiandaModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="row">
						<div class="col-md-6">
							<h3>增加简答题</h3>
						</div>
						
						<div class="col-md-6"><h3>Search: <input ng-model="query"></h3></div>
					</div>
                </div>
                <div class="modal-body" style="height:400px;overflow:scroll;">
                    <div class="row" ng-repeat="multiple in longAnswers | filter:query">
						<div class="col-md-1">
							<input type="checkbox" class="check-xuanze" ng-model="multiple.selected"/>
						</div>
						<div class="col-md-8">
							<pre>{{multiple.questionStem}}</pre> 
						</div>
						<div class="col-md-1">
							<div class="row">
								<div class="col-md-12">知识点</div>
								<div class="col-md-12" ng-repeat="knowledge in multiple.knowledge">
									<span class="label label-info">{{knowledge}}</span>
								</div>
							</div>
						</div>
						<div class="col-md-1">
							难度：{{multiple.difficulty}}
						</div>
						<div class="col-md-1">
							分值：{{multiple.value}}
						</div>
					</div>
				</div>
				<div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" 
						ng-click="addExamQuestion('jianda')">
						确认添加
					</button>
                </div>
			</div>
        </div>
    </div>
	
	
	
	<!--页脚-->
    <footer class="footer clearfix">
        <div class="container">
            <ul class="list-unstyled list-inline pull-left">
                <li>
                    <a href="#">FAQ</a>
                </li>
                <li>
                    <a href="#">Git</a>
                </li>
                <li>
                    <a href="#">Blog</a>
                </li>
            </ul>
            <p class="pull-right">@ 2014 软件项目管理团队</p>

        </div>
    </footer>

    <script>
        $(document).ready(function () {
            $(".item").click(function () {
                $(this).parent().parent().siblings("button").html($(this).text() + '<span class="caret"></span>');
            });

        });
    </script>
    <script type="text/javascript">
        $(".form_datetime").datetimepicker({
            format: "yyyy/mm/dd - hh:ii",
            autoclose: true,
            todayBtn: true,
            pickerPosition: "bottom-left"
        });
    </script>
    <script>
        $("#confirm").click(function(){
            $("#paper").show("slow")
        })
        $("#chosedele-xuanze").click(function(){
            $("#confirmdele-xuanze").toggle("slow")
            $(".check-xuanze").toggle("slow")
        })
        $("#chosedele-tiankong").click(function(){
            $("#confirmdele-tiankong").toggle("slow")
            $(".check-tiankong").toggle("slow")
        })
        $("#chosedele-jianda").click(function(){
            $("#confirmdele-jianda").toggle("slow")
            $(".check-jianda").toggle("slow")
        })
		
		$("#confirmdele-xuanze").click(function(){
			$("#confirmdele-xuanze").hide("slow");
		})
		$("#confirmdele-tiankong").click(function(){	
			$("#confirmdele-tiankong").hide("slow");
        })
		$("#confirmdele-jianda").click(function(){	
			$("#confirmdele-jianda").hide("slow");
        })
    </script>
	
	<script> <!-- angular -->
		
		function editexam($scope,$http){
			//init
			var teacher = new Object();
			var courses = new Array() , exam = new Object();
			
			var multiples = new Array() , exam_multiples = new Array();
			var shortAnswers = new Array(), exam_shorts = new Array();
			var longAnswers = new Array(), exam_longs = new Array();
			var multipleSum = 0 , shortSum = 0, longSum = 0;
			
			$scope.teacher = teacher;
			$scope.courses = courses; $scope.exam = exam;
			$scope.multiples = multiples; 
			$scope.shortAnswers = shortAnswers; 
			$scope.longAnswers = longAnswers;
			$scope.exam_multiples = exam_multiples; 
			$scope.exam_shorts = exam_shorts;
			$scope.exam_longs = exam_longs;
			$scope.multipleSum = $scope.shortSum = $scope.longSum = 0;
			
			//init
			teacher.name = "foolifish07";
			exam.name = ''; exam.startTime = ''; exam.endTime = new Object(); //exam.courseNo = -1;
			for(var i=0;i<3;i++) {
				courses[i] = new Object();
				courses[i].courseNo = i;
				courses[i].courseName = '计算机组成原理'+i;
			}
			for(var i = 0;i<3;i++){
				multiples[i] = new Object();
				multiples[i].questionNo = i; multiples[i].selected = true;
				multiples[i].questionStem = '1.一个C程序的执行是从_____。         \nA)本程序的main函数开始,到main函数结束               B)本程序文件的第一个函数开始,到本程序文件的最后一个函数结束 \nC)本程序的main函数开始,到本程序文件的最后一个函数结束  D)本程序文件的第一个函数开始,到本程序main函数结束';
				multiples[i].difficulty = 3;
				multiples[i].value = 2;
				
				multiples[i].knowledge  = new Array();
				multiples[i].knowledge[0] = '并查集';
				multiples[i].knowledge[1] = '垃圾暴力';
				//alert(init[i].knowledge.length);
			}
			for(var i = 0;i<3;i++){
				shortAnswers[i] = new Object();
				shortAnswers[i].questionNo = i; shortAnswers[i].selected = true;
				shortAnswers[i].questionStem = '1.若x和n均是int型变量,且x和n的初值均为5,则计算表达式 x+=n++ 后x的值为 ____,n的值为6.';
				shortAnswers[i].difficulty = 3;
				shortAnswers[i].value = 2;
				
				shortAnswers[i].knowledge  = new Array();
				shortAnswers[i].knowledge[0] = '并查集';
				shortAnswers[i].knowledge[1] = '垃圾暴力';
			}
			for(var i = 0;i<4;i++){
				longAnswers[i] = new Object();
				longAnswers[i].questionNo = i; longAnswers[i].selected = true;
				longAnswers[i].questionStem = '1.关键字和一般标识符有什么不同？';
				longAnswers[i].difficulty = 3;
				longAnswers[i].value = 2;
				
				longAnswers[i].knowledge  = new Array();
				longAnswers[i].knowledge[0] = '并查集';
				longAnswers[i].knowledge[1] = '你妹夫';
				//alert(init[i].knowledge.length);
			}
		
			//get active data for multiples && shortAnswers && longAnswers in models
			// 由于 selected 属性的存在 赋值用  angular.extend
			$http.get("teacher!getInfo.action").success(function(data){
				$scope.teacher = teacher = angular.copy(data.teacher);
			}).error(function(){
				//alert('wocao fail');
			});
			
			$scope.chooseCourse = function(courseNo){
				//alert(exam.name);
				exam.courseNo = courseNo ;
				//alert(exam.courseNo);
			}
			// new an exam
			$scope.newExam = function(){
				//alert(exam.startTime);
				var d = Date.parse(exam.startTime);
				var dd = new Date(exam.startTime);
				//alert("fdsa");
				console.log(dd.getDate());
				//var xx = angular.toJson(exam.startTime);
				//console.log( xx );
				//alert(exam.endTime);
			}
			
			$scope.addExamQuestion = function(type){
				var from , to , cnt = 0;
				if ( type=='xuanze' ) from = multiples , to = exam_multiples;
				if ( type=='tiankong' ) from = shortAnswers , to = exam_shorts;
				if ( type=='jianda' ) from = longAnswers , to = exam_longs;
				
				for(var i = 0;i<from.length;i++){
					if ( from[i].selected==true ){
						var now = to.length;
						to[now] = angular.copy( from[i] );
						to[now].selected = false;
						cnt += from[i].value;
					}
				}
				
				if ( type=='xuanze' ) $scope.multipleSum += cnt;
				if ( type=='tiankong' ) $scope.shortSum += cnt;
				if ( type=='jianda' ) $scope.longSum += cnt;
			}
			$scope.deleteExamQuestion = function(type){
				var from , to = new Array(), cnt = 0;
				if ( type=='xuanze' ) from = exam_multiples;
				if ( type=='tiankong' ) from = exam_shorts;
				if ( type=='jianda' ) from  = exam_longs;
				
				for(var i = 0;i<from.length;i++){
					if ( from[i].selected!=true ){
						var now = to.length;
						to[now] = angular.copy( from[i] );
						to[now].selected = false;
						cnt += from[i].value;
					}
				}
				
				if ( type=='xuanze' ) $scope.multipleSum = cnt , 
					$scope.exam_multiples = exam_multiples = angular.copy(to);
				if ( type=='tiankong' ) $scope.shortSum = cnt , 
					$scope.exam_shorts = exam_shorts = angular.copy(to);
				if ( type=='jianda' ) $scope.longSum = cnt , 
					$scope.exam_longs = exam_longs = angular.copy(to);
			}
		}
		
	</script>
	
</body>

</html>